<template>
  <div class="posttable">
    <el-row style="margin-bottom: 10px;">
      <el-col :span="24" style="padding-right: 30px;padding-left: 40px;margin-top: 10px;">
        <el-row class="bot" v-if="info.customerDto">
          <el-col style="margin-bottom: 20px;">
            <el-col style="width:20%">
              <el-row>
                <el-col>
                  <p class="title">客户简称</p>
                </el-col>
                <el-col>
                  <p class="text">{{info.customerDto.name}}</p>
                </el-col>
              </el-row>
            </el-col>
            <el-col style="width:20%">
              <el-row>
                <el-col>
                  <p class="title">客户全称</p>
                </el-col>
                <el-col>
                  <p class="text">{{info.customerDto.fullName}}</p>
                </el-col>
              </el-row>
            </el-col>
            <el-col style="width:20%">
              <el-row>
                <el-col>
                  <p class="title">英文简称</p>
                </el-col>
                <el-col>
                  <p class="text">{{info.customerDto.abbreviation}}</p>
                </el-col>
              </el-row>
            </el-col>
            <el-col style="width:20%">
              <el-row>
                <el-col>
                  <p class="title">负责助理</p>
                </el-col>
                <el-col>
                  <p class="text">{{info.customerDto.assName}}</p>
                </el-col>
              </el-row>
            </el-col>
            <el-col style="width:20%">
              <el-row>
                <el-col>
                  <p class="title">有无需求编号</p>
                </el-col>
                <el-col>
                  <p class="text" v-if="info.customerDto.mendChange === '0'">无</p>
                  <p class="text" v-if="info.customerDto.mendChange === '1'">有</p>
                </el-col>
              </el-row>
            </el-col>
          </el-col>
          <el-col style="margin-bottom: 20px;">
            <el-col style="width:20%">
              <el-row>
                <el-col>
                  <p class="title">收件人类型</p>
                </el-col>
                <el-col>
                  <p class="text" v-if="info.customerDto.unifiedInter == 'N'">非统一收件人</p>
                  <p class="text" v-if="info.customerDto.unifiedInter == 'Y'">统一收件人</p>
                </el-col>
              </el-row>
            </el-col>
            <el-col style="width:20%" v-if="show">
              <el-row>
                <el-col>
                  <p class="title">收件人邮箱数量</p>
                </el-col>
                <el-col>
                  <p class="text">{{info.customerDto.receiveNum}}</p>
                </el-col>
              </el-row>
            </el-col>
            <el-col style="width:20%">
              <el-row>
                <el-col>
                  <p class="title">转HR系统</p>
                </el-col>
                <el-col>
                  <p class="text">{{info.customerDto.hrSystem}}</p>
                </el-col>
              </el-row>
            </el-col>
            <el-col style="width:20%">
              <el-row>
                <el-col>
                  <p class="title">负责交付</p>
                </el-col>
                <el-col>
                  <p class="text">{{info.customerDto.delivery}}</p>
                </el-col>
              </el-row>
            </el-col>
            <el-col style="width:20%">
              <el-row>
                <el-col>
                  <p class="title">试水客户</p>
                </el-col>
                <el-col>
                  <p class="text">{{info.customerDto.testWater}}</p>
                </el-col>
              </el-row>
            </el-col>
          </el-col>
          <el-col style="margin-bottom: 20px;">
            <el-col style="width:20%">
              <el-row>
                <el-col>
                  <p class="title">活跃客户</p>
                </el-col>
                <el-col>
                  <p class="text">{{info.customerDto.customerActive}}</p>
                </el-col>
              </el-row>
            </el-col><el-col style="width:20%">
              <el-row>
                <el-col>
                  <p class="title">接口方式</p>
                </el-col>
                <el-col>
                  <p class="text">{{info.customerDto.interfaceMode}}</p>
                </el-col>
              </el-row>
            </el-col>
          </el-col>
        </el-row>
        <el-row class="bot" v-if="info.customerDto">
          <el-col>
            <p class="title">客户简介</p>
          </el-col>
          <el-col :span="12">
            <p class="text" v-html="info.customerDto.introduction"></p>
          </el-col>
        </el-row>
        <el-row>
          <div class="Line"></div>
        </el-row>
        <el-row v-for="(item,index) in info.employAddrDetails" :key="index">
          <el-col v-if="index !== 0">
            <div class="Line"></div>
          </el-col>
          <el-col class="bot">
            <el-col style="width:20%" v-for="(item6,index6) in item.customerAddrs" :key="index6">
              <el-col>
                <p class="title">办公地点</p>
              </el-col>
              <el-col>
                <p class="text word">{{item6.name}}</p>
              </el-col>
            </el-col>
          </el-col>

          <el-row v-if="show" v-for="(item5,index5) in item.rcMail" :key="index5">
            <el-col style="width:20%" class="bot">
              <el-col>
                <p class="title">收件人邮箱</p>
              </el-col>
              <el-col>
                <p class="text word">{{item5.receiveMail}}</p>
              </el-col>
            </el-col>
            <el-col
              v-for="(item1,index1) in item5.cpSendMail"
              :key="index1"
              style="width:20%"
              class="bot"
            >
              <el-col>
                <el-col>
                  <p class="title">抄送人邮箱</p>
                </el-col>
                <el-col>
                  <p class="text">{{item1.mail}}</p>
                </el-col>
              </el-col>
            </el-col>
          </el-row>

          <!--客户联系人部分-->
          <el-col>
            <el-col>
              <el-row v-for="(item2,index2) in item.customerManagers" :key="index2" class="bot">
                <el-col style="width:20%">
                  <el-col>
                    <p class="title">客户联系人</p>
                  </el-col>
                  <el-col>
                    <p class="text word">{{item2.name}}</p>
                  </el-col>
                </el-col>
                <el-col style="width:20%">
                  <el-col>
                    <p class="title">联系人电话</p>
                  </el-col>
                  <el-col>
                    <p class="text word">{{item2.phone}}</p>
                  </el-col>
                </el-col>
                <el-col style="width:20%">
                  <el-col>
                    <p class="title">联系人邮箱</p>
                  </el-col>
                  <el-col>
                    <p v-if="item2.mail" class="text word">{{item2.mail}}</p>
                    <p class="text" v-if="!item2.mail">无</p>
                  </el-col>
                </el-col>
              </el-row>
            </el-col>
            <!--销售信息部分-->
            <el-col class="bot">
              <el-row v-for="(item3,index3) in item.customerSalesmans" :key="index3" class="bot">
                <el-col style="width:20%">
                  <el-col>
                    <p class="title">销售名称</p>
                  </el-col>
                  <el-col>
                    <p class="text word">{{item3.name}}</p>
                  </el-col>
                </el-col>
                <el-col style="width:20%">
                  <el-col>
                    <p class="title">销售电话</p>
                  </el-col>
                  <el-col>
                    <p class="text word">{{item3.phone}}</p>
                  </el-col>
                </el-col>
                <el-col style="width:20%">
                  <el-col>
                    <p class="title">销售邮箱</p>
                  </el-col>
                  <el-col>
                    <p class="text word">{{item3.mail}}</p>
                  </el-col>
                </el-col>
              </el-row>
            </el-col>
          </el-col>
        </el-row>
      </el-col>
    </el-row>
  </div>
</template>
<script>
import axios from "axios";
import qs from "qs";
export default {
  name: "employdetail",
  props: {
    detailCode: {
      type: Object
    }
  },
  data() {
    return {
      id: null,
      info: [],
      name: "",
      fullName: "",
      introduction: "",
      show: true
    };
  },
  created() {
    this.id = this.detailCode.id;

    this.getdetail();
  },
  methods: {
    getdetail() {
      axios
        .post(
          this.url + "/employ/getEmployerByid",
          qs.stringify({
            id: this.id
          })
        )
        .then(res => {
          this.unlogin(res.data.code);
          if (res.data.code == 200) {
            this.info = res.data.data;
            if (this.info.customerDto.unifiedInter == "N") {
              this.show = false;
            } else {
              this.show = true;
            }
          }
        });
    }
  }
};
</script>
<style scoped>
.title {
  color: #757575;
  margin-bottom: 10px;
  font-size: 14px;
}

.text {
  color: #333333;
  font-weight: 700;
  font-size: 14px;
  word-break: break-all;
  white-space: pre-line;
}

.bot {
  margin-bottom: 30px;
}

.Line {
  border: 0.5px solid #e8e8e8;
  margin-bottom: 30px;
}

@media screen and (min-width: 1200px) and (max-width: 1900px) {
  .word {
    word-break: break-all;
    width: 200px;
  }
}
</style>
